<template>
  <div class="execution">
    <basic-container>
      <avue-crud
        v-model="form"
        v-bind="bindVal"
        v-on="onEvent"
        :page.sync="page"
        :permission="permissionList"
        :before-open="beforeOpen"
        :before-close="beforeClose">
        <template slot-scope="scope" slot="menuLeft">
          <el-button
            type="primary"
            size="small"
            @click.stop="handleBatchSubmit"
            v-permission="permissionList.submitBtn"
          >提 交</el-button>
          <el-popover
            v-permission="permissionList.auditBtn"
            placement="bottom"
            width="260"
            v-model="batchReviewVisible"
          >
            <div style="text-align: center; margin: 0">
              <el-form>
                <el-form-item label="审批建议">
                  <el-input type="textarea" span="24" v-model="checkReason"></el-input>
                </el-form-item>
              </el-form>
               <el-row>
              <el-button size="mini" type="primary" @click="batchReview(2)">审批通过</el-button>
              <el-button type="primary" size="mini" @click="batchReview(3)">审批不通过</el-button>
               </el-row>
              <el-row style="margin-top:5px;">
                <el-button type="primary" size="mini" @click="batchReviewVisible=false">取消</el-button>
              </el-row>
            </div>
            <el-button type="primary" size="small" slot="reference">审批</el-button>
          </el-popover>
          <el-button
            type="primary"
            size="small"
            v-permission="permissionList.delBtn"
            @click.stop="handleBatchDelete"
          >删 除</el-button>
          <el-button
            type="primary"
            size="small"
            v-permission="permissionList.exportBtn"
            @click.stop="handleExport"
          >导 出</el-button>
          <el-button
            type="primary"
            size="small"
            :hidden="true"
            v-if="false"
            @click.stop="handlePrint"
          >打 印</el-button>
        </template>
        <template slot-scope="scope" slot="menu">
          <el-button :type="scope.type" :size="scope.size" @click.stop="myView(scope.row,scope.index)">预览</el-button>
          <el-button :type="scope.type" :size="scope.size"
            v-if="scope.row.checkStatus=='0'||scope.row.checkStatus=='3'"
            v-permission="permissionList.editBtn"
            @click.stop="rowEdit(scope.row,scope.index)">编 辑
          </el-button>
          <!-- <el-button :type="scope.type" :size="scope.size"
            v-if="scope.row.checkStatus=='0'"
            @click.stop="rowDel(scope.row,scope.index)">删 除
          </el-button> -->
        </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
import baseCrud from '@/mixins/base-crud'
import { fetchList, auditObj, batchDelete } from "@/api/subway/swtkstockflow";
import {
  tableOption,
  tableOptionViewNo,
  tableOptionViewYes,
} from "@/const/crud/subway/swtkstockflow";
import { mapGetters } from 'vuex'

export default {
  name: "SwStStockFlow",
  mixins: [baseCrud('subway/swtkstockflow')],
  data() {
    return {
      form: {
        applyPersonCode: '',
        applyPersonName: ''
      },
      tableOptionViewNo: tableOptionViewNo,
      tableOptionViewYes: tableOptionViewYes,
      batchReviewVisible: false,
      checkReason:'',
      searchForm: {
        handStatus: '0'
      }
    };
  },
  computed: {
    ...mapGetters(['userInfo']),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permissions.st_stock_flow_add, false),
        editBtn: this.vaildData(this.permissions.st_stock_flow_update, false),
        delBtn: this.vaildData(this.permissions.st_stock_flow_delete, false),
        submitBtn: this.vaildData(this.permissions.st_stock_flow_submit, false),
        auditBtn: this.vaildData(this.permissions.st_stock_flow_audit, false),
        exportBtn: this.vaildData(this.permissions.st_stock_flow_export, false),
      };
    },
  },
  methods: {
    getList(page) {
      this.tableLoading = true
      return fetchList(Object.assign({
        current: page.currentPage,
        size: page.pageSize
      }, this.params, this.searchForm)).then(response => {
        this.tableData = response.data.data.records
        this.tableData.forEach(row => {
          row.flowBeforeTicketArea = Number(row.flowBeforeTicketArea)
          row.flowAfterTicketArea = Number(row.flowAfterTicketArea)
        })
        this.page.total = response.data.data.total
        this.tableLoading = false
      })
    },
    beforeRowSave(row, done, loading){
      if(row.flowAfterTicketArea == row.flowBeforeTicketArea){
        this.$message.error("流动前票区和流动后票区选项不能一样！");
        loading();
      }else{
        row.checkStatus = 0
        done()
      }
    },
    batchReview(status) {
      var tableSelect = this.$refs.crud.tableSelect;
      if (tableSelect.length == 0) {
        this.$message.info("请选择要审批的数据");
        return;
      }
      for (const table of tableSelect) {
        table.checkStatus = status;
        table.remark=this.checkReason;
      }
      auditObj(tableSelect).then((data) => {
        this.$message.success("审批成功");
        this.getList(this.page);
        this.batchReviewVisible = false;
      });
    },
    myView(row, index) {
      if (row.checkStatus != "2" || row.checkStatus != "3") {
        console.log("未提交")
        this.tableOption = tableOptionViewNo;
      }
      if (row.checkStatus === "2" || row.checkStatus === "3") {
        console.log("提交")
        this.tableOption = tableOptionViewYes;
      }
      this.$refs.crud.rowView(row, index);
    },
    beforeOpen(done, type) {
      if(type == 'add'){
          this.form.applyPersonName = this.userInfo.nikename
          this.form.applyPersonCode = this.userInfo.userCode
      }
      done();
    },
    beforeClose(done, type) {
      this.tableOption = tableOption;
      done();
    },
    handleBatchDelete(){
      var tableSelect = this.$refs.crud.tableSelect;
      if (tableSelect.length == 0) {
        this.$message.info("请选择要删除的数据");
        return;
      }
      for(let row of tableSelect){
        if(row.checkStatus != '0'){
          this.$message.info('只有未提交状态的数据才能删除')
          return
        }
      }
      let ids = tableSelect.map(row => row.id)
      this.$confirm(`是否确认删除${ids.length}条记录`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return batchDelete(ids)
      }).then(() => {
        this.$message.success('删除成功')
        this.getList(this.page)
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
